<template>
    <div>
        <el-dialog v-model="dialogVisible" width="80%" align-center :close-on-click-modal="false" :show-close="false"
            :before-close="handleClose" destroy-on-close draggable>
            <template #header="{ close }">
                <div class="dialog-header flex justify-between items-center">
                    <div>调整专家</div>
                    <el-icon class="el-icon--left cursor-pointer" @click="close">
                        <CircleCloseFilled color="#fff" />
                    </el-icon>
                </div>
            </template>
            <!-- 基本信息 -->
            <div class="bg-white mt-[10px]">
                <div class="p-[10px]">
                    <el-descriptions title="" :column="2" border label-width="140">
                        <el-descriptions-item label-class-name="gdlable" label="学科名称">{{
            formatsubjectId(xzcgTable[0].subjectId)
        }}</el-descriptions-item>
                        <el-descriptions-item label-class-name="gdlable" label="成果名称">{{
                xzcgTable[0].productName
            }}</el-descriptions-item>
                        <el-descriptions-item label-class-name="gdlable" label="奖励名称">{{
                xzcgTable[0].honorName
            }}</el-descriptions-item>
                        <el-descriptions-item label-class-name="gdlable" label="已选专家">
                            <div class="flex flex-wrap items-center">
                                <span class="mr-1.5" v-for="item in xzcgTable[0].selectExpertList" :key="item">{{
            JSON.parse(item).name
        }}</span>
                            </div>
                        </el-descriptions-item>
                        <el-descriptions-item label-class-name="gdlable" label="学科专家">
                            <el-checkbox-group v-model="xzcgTable[0].selectExpertList"
                                @change="changeExpert(xzcgTable[0])">
                                <el-checkbox v-for="item in allExpertList" :disabled="disabledExpert(xzcgTable[0],item)"
                                    :key="item.id" :label="item.name" :value="item.idStr" />
                            </el-checkbox-group>
                        </el-descriptions-item>
                    </el-descriptions>
                </div>
            </div>
            <template #footer>
                <div class="dialog-footer">
                    <div class="operate-btns">
                        <el-button type="primary" @click="close">关闭</el-button>
                    </div>
                </div>
            </template>
        </el-dialog>
    </div>
</template>
<script setup>
import BaseHead from "@/views/project/components/BaseHead.vue";
import { getallExpertList, addReviewExpert } from "@/api/achievement/cghj";
import { getCategory } from "@/api/system/category";
import _ from "lodash";
const props = defineProps({
    xzcgList: Array,
    reviewSchemeId: String,
    reviewPlanId: String,
});

const dialogVisible = defineModel();
const emit = defineEmits(["callBack"]);
const handleClose = (done) => {
    emit("callBack", "");
    done();
};
const close = () => {
    dialogVisible.value = false;
    emit("callBack", "");
};
const allExpertList = ref([]);
const getexpertListByGroupMet = () => {
    getallExpertList().then((res) => {
        allExpertList.value = res.data;
        allExpertList.value.forEach((item) => {
            Reflect.set(item, "idStr", JSON.stringify(item));
        });
    });
};
const subjectList = ref([]);
const kjxkflList = ref([]);
const skxkflList = ref([]);
const xzcgTable = ref([]);
const getCategoryMet = async () => {
    let parms = {
        bizName: "一级学科",
        valueCascade: "2",
    };
    let res = await getCategory(parms);
    if (res.code == 200) {
        kjxkflList.value = res.data;
    }
};
const getCategoryMet1 = async () => {
    let parms1 = {
        bizName: "一级学科",
        valueCascade: "1",
    };
    let res1 = await getCategory(parms1);
    if (res1.code == 200) {
        skxkflList.value = res1.data;
    }
};
const formatsubjectId = (cellValue) => {
    if (subjectList.value.length && cellValue) {
        return subjectList.value.find((item) => item.id == cellValue)
            ? subjectList.value.find((item) => item.id == cellValue).label
            : "";
    } else {
        return "";
    }
};
const changeExpert = (i) => {
    console.log(i, "selectExpertList");
    let parms = {
        honorApplyBookId: i.id,
        honorName: i.honorName,
        reviewPlanId: props.reviewPlanId,
        reviewSchemeId: props.reviewSchemeId,
    };
    parms.expertDTOS = _.cloneDeep(i.selectExpertList);
    parms.expertDTOS = parms.expertDTOS.map((item) => JSON.parse(item));
    addReviewExpert(parms).then((res) => { });
};
const disabledExpert = (i, j) => {
    let havedisabled = i.authorList1.some(item => {
        return item.id == j.personId
    })
    return havedisabled
}

watch(
    () => props.xzcgList,
    (newValue) => {
        console.log(newValue, "newValue");
        xzcgTable.value = _.cloneDeep(newValue);
        subjectList.value = [];
        let zaArr = xzcgTable.value.map((item) => {
            return item.selectExpertId ? item.selectExpertId : '';
        });
        console.log(zaArr, "zaArr");
        xzcgTable.value.forEach((item, index) => {
            item.selectExpertList = allExpertList.value.filter((item1) => {
                return zaArr[index].includes(item1.id);
            });
            item.selectExpertList = item.selectExpertList.map((item) => item.idStr);
        });
        console.log(xzcgTable.value, " xzcgTable.value");
        newValue.forEach((element) => {
            let zcArr = kjxkflList.value.filter((item) => {
                return item.id == element.subjectId;
            });
            let zcArr1 = skxkflList.value.filter((item) => {
                return item.id == element.subjectId;
            });
            subjectList.value = [...subjectList.value, ...zcArr, ...zcArr1];
        });
    },
    { deep: true }
);

getCategoryMet();
getCategoryMet1();
getexpertListByGroupMet();
</script>
<style scoped lang="scss">
@import url("@/views/achievement/index.scss");

.tips {
    color: rgb(255, 0, 0);
    font-size: 12px;
    padding-top: 12px;
    padding-left: 8px;
}
</style>
